* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
li {
  list-style: none;
}
@font-face {
  font-family: electronicFont;
  src: url(../font/DS-DIGIT.TTF);
}
body {
  background: url(../img/bg.jpg) repeat top center;
  background-size: 100% 100%;
  line-height: 1.15;
}
header {
  position: relative;
  height: 100px;
  background: url(../img/head_bg.png) no-repeat;
  background-size: 100% 100%;
}
header h1 {
  font-size: 30px;
  color: #fff;
  text-align: center;
  line-height: 80px;
}
header .showTime {
  position: absolute;
  right: 38px;
  top: 0;
  line-height: 75px;
  color: rgba(255, 255, 255, 0.7);
  font-size: 15px;
}
.mainbox {
  display: flex;
  margin: 0 auto;
  min-width: 100vw; /* 使用视口宽度作为最小宽度 */
  min-height: 100vh; /* 使用视口高度作为最小高度 */
  padding: 10px 10px 0;
}

.mainbox .column {
  flex: 3;
}
.mainbox .column:nth-child(2) {
  flex: 5;
  margin: 0  10px 15px;
}
.panel {
  position: relative;
  padding: 0 0 15px 40px;
  margin-bottom: 15px;
  height: 340px;
  border: 1px solid rgba(25, 186, 139, 0.17);
  background: url(../img/line1.png) rgba(255, 255, 255, 0.07);
  background-size: 100% 100%;
}
.panel::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  border-left: 2px solid #02a6b5;
  border-top: 2px solid #02a6b5;
  content: "";
}
.panel::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid #02a6b5;
  border-top: 2px solid #02a6b5;
  content: "";
}
.panel .panel-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
}
.panel .panel-footer::before {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  height: 10px;
  border-left: 2px solid #02a6b5;
  border-bottom: 2px solid #02a6b5;
  content: "";
}
.panel .panel-footer::after {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid #02a6b5;
  border-bottom: 2px solid #02a6b5;
  content: "";
}
.panel h2 {
  display: block;
  height: 48px;
  color: #FFF;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
  line-height: 48px;
}
.panel .chart {
  height: 240px;
}
.no {
  padding: 15px;
  background: rgba(101, 132, 226, 0.1);
}
.no-hd {
  position: relative;
  border: 1px solid rgba(25, 186, 139, 0.17);
}
.no-hd::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 10px;
  border-left: 2px solid #02a6b5;
  border-top: 2px solid #02a6b5;
  content: "";
}
.no-hd::after {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 30px;
  height: 10px;
  border-right: 2px solid #02a6b5;
  border-bottom: 2px solid #02a6b5;
  content: "";
}
.no-hd ul {
  display: flex;
}
.no-hd ul li {
  position: relative;
  flex: 1;
  height: 80px;
  text-align: center;
  font-size: 70px;
  font-family: electronicFont;
  color: #ffeb7b;
}
.no-hd ul li:first-child:after {
  content: "";
  position: absolute;
  top: 25%;
  right: 0;
  width: 1px;
  height: 50%;
  background: rgba(255, 255, 255, 0.2);
}
.no-bd ul {
  display: flex;
}
.no-bd ul li {
  flex: 1;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  font-size: 18px;
  height: 40px;
  line-height: 40px;
  padding: 10px;
}
.map {
  position: relative;
  height: 810px;
}
.map .map1 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 518px;
  height: 518px;
  background: url(../img/map.png);
  background-size: 100% 100%;
  opacity: 0.3;
}
.map2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 643px;
  height: 643px;
  background: url(../img/lbx.png);
  background-size: 100% 100%;
  animation: rotatel1 15s linear infinite;
}
@keyframes rotatel1 {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.map3 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 566px;
  height: 566px;
  background: url(../img/jt.png);
  background-size: 100% 100%;
  animation: rotatel2 10s linear infinite;
}
@keyframes rotatel2 {
  from {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  to {
    transform: translate(-50%, -50%) rotate(-360deg);
  }
}
.chart {
  position: absolute;
  top: 68px;
  left: 0;
  width: 100%;
  height: 810px;
}
.map .chart {
  position: absolute;
  top: -10px;
  left: 0;
  width: 100%;
  height: 810px;
}

.line {
  margin-top: 10px;
  height: 650px;
}

.line .chart {
  position: absolute;
  top: 45px;
  left: 0;
  width: 100%;
  height: 600px;
}

.line2 {
  height: 500px;
}

.line2 .chart {
  position: absolute;
  top: 68px;
  left: 0;
  width: 100%;
  height: 400px;
}
.bar {
  height: 451px;
}
.bar .chart {
  position: absolute;
  top: 50px;
  left: 0;
  width: 100%;
  height: 400px;
}
/*
.box1 {
  position: absolute;
  top: 50px;
  left: 0;
  width: 100%;
  height: 48px;
}

.ui.dropdown .menu {
  max-height: 200px !important; !* 修改最大高度 *!
  overflow-y: auto !important; !* 开启滚动条 *!
}
.ui.dropdown .menu>.item {
  height: 30px !important; !* 修改高度 *!
  line-height: 30px !important; !* 修改行高 *!
  padding: 0 !important; !* 设置内边距为0 *!
  margin: 0 !important; !* 设置外边距为0 *!
}
.ui.dropdown .menu>.item {
  font-size: 12px !important; !* 修改字体大小 *!
}
*/
